<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>区域设备信息</title>
<link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/css/public.css"></link>
<link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/ext/resources/css/ext-all.css"></link>

<link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/ext/resources/css/xtheme-slate.css"></link>
<script src="<%=request.getContextPath() %>/ext/adapter/ext/ext-base.js"></script>
<script src="<%=request.getContextPath() %>/ext/ext-all.js"></script>
<script src="<%=request.getContextPath() %>/ext/src/locale/ext-lang-zh_CN.js"></script>	

<script type="text/javascript">
Ext.onReady(function(){
	Ext.Ajax.on('requestcomplete',checkUserSessionStatus, this);      
	function checkUserSessionStatus(conn,response,options){      
	    if(response.getResponseHeader('sessionstatus')){      
	    	parent.location.href='/xdj/index.jsp';   
	    }      
	}  
	var thenode=0;
	var zoneForm;
	var panel2;
	var panel3;
	var str;
	var win;
	var store2;
	var  ids="";
	var json2;
	var store;
	var oSelMode;
	var oRecords;
	var treeloader = new Ext.tree.TreeLoader({   // dataUrl : 'tree.jsp'//这里可以不需要指定URL，在加载前事件响应里面设置 
		
	});  

	var rootnode = new Ext.tree.AsyncTreeNode({  // 异步加载根节点 
		id : '2',  
		text : '区域设备信息',
		cls : 'folder' 
	});  
	var tree=new Ext.tree.TreePanel({
		el : 'tree',// 将树形添加到一个指定的div中,非常重要！  
		border:false,
		region : 'west',  
		//title : '功能菜单',  
		lines:true, //线段
		width : 200, 
		//height:430,
		split : true, 
		leaf:false,
		//autoHeight : true,
		//height:window.screen.height,
		frame : true,// 美化界面    
		enableDD : false,// 是否支持拖拽效果  
		//autoScroll	 : true, 
	//	containerScroll : true,// 是否支持滚动条  
		rootVisible : true, // 是否隐藏根节点,很多情况下，我们选择隐藏根节点增加美观性  
		animate : true, // 动画效果  
		root : rootnode,
		loader : treeloader ,
		listeners : {
			'beforeload' : function() {
				treeloader.dataUrl = "zone_loadZoneTree";
			},'click':function(node){
				alert(node.id);
				thenode=node.id
				store.load({
					params:{
						zoneID:node.id
					}
				});
			}
		}
		
	// 树加载  
	});  
	rootnode.expand(true);
	tree.render();  // 渲染树形 
	
	//表格
	var sm = new Ext.grid.CheckboxSelectionModel();//列的复选框
	var cm=new Ext.grid.ColumnModel([
		new Ext.grid.RowNumberer(),  //自动增加序列号
		//sm, //加到每列的前边
		{header:'设备名称',dataIndex:"deviceName",sortable:true},
		{header:'安装位置',dataIndex:"place"},
		{header:'安装单位',dataIndex:"department"},
		{header:'使用部门',dataIndex:"useDepartment"},
		{header:'ID',dataIndex:"deviceInfoID",hidden:true}
	]);//定义相应的列模型
	
	
	var cm2=new Ext.grid.ColumnModel([
	    new Ext.grid.RowNumberer(),  //自动增加序列号
	    sm, //加到每列的前边
	    {header:'设备名称',dataIndex:"deviceName",sortable:true},
	    {header:'ID',dataIndex:"deviceInfoID",hidden:true}
	   ]);//定义相应的列模型

	var store=new Ext.data.JsonStore({
		url: 'zone_loadAll',
		root: 'result',
		// idProperty:'id',
		totalProperty:'totalProperty',
	    fields: ["deviceName","place","department","useDepartment","deviceInfoID"]
	});//存储前两项的定义的东西，将其连接起来
	
	 panel = new Ext.grid.GridPanel({
		 region:'center',
		border:false,
		cm:cm,
		//sm:sm,
		//height:400,
		//width:280,
		//border:false,
		store:store,
		height :  document.body.clientHeight, //设置表格的高度 true为自动获取表格的大小
		//renderTo:'grid' , //渲染容器
		enableColumnMove:false,//不可以使表格列移动
		enableColumnResize:false, //不可以改变列的宽度
		stripeRows:false, //True表示为显示行的分隔符
		loadMask:true,  //会有一个Ext.LoadMask的遮罩效果
		trackMouseOver : true,  //True表示为鼠标移动时高亮显示（默认为true）。
		enableDragDrop : true,
		viewConfig:{
			forceFit:true //让没列自动填满表格，根据你设置的宽度按比例分配
		},
		tbar:[{
	    	text: "删除",disabled:true,id:'cToolDeleteDevice',
	    	icon:'../image/public/user_delete.png',
	    	handler:function(){
	    		Ext.MessageBox.confirm("提示","您确定要删除这些信息吗?", function(button,text){   
	    			if(button=='yes'){
	    				var record=panel.getSelectionModel().getSelected();
			    		var r=record.get("deviceInfoID");
			    		alert(r);
			    		var json=[];
						json.push('[{deviceInfoID:'+r+',zoneID:0}]');
						Ext.Ajax.request({
							url:'zone_update',
							success:function(response){
								
								var result = Ext.util.JSON.decode(response.responseText);
								if(result.success==true){
									store.load({
										params:{
											zoneID:thenode
										}
									});
								}else{
									Ext.Msg.alert("提示","操作失败，请重试。") ;
								}
							},
							params:{
								ids:json
							}
						});		
		    		Ext.getBody().unmask();
	    			}
	    			}); 

	    		
	   		 }
		},{
	 		text: "修改",disabled:true,id:'cModifyBox',
	 		icon:'../image/public/user_edit.png',
	 		handler:function(){
	 			Ext.MessageBox.confirm("提示","您确定要修改这些信息吗?", function(button,text){   
	 				if(button=='yes'){
	 					if(thenode==0){
	 		    			alert("请选择区域设备");
	 		    		}else{
	 		    			Ext.getBody().mask();
		 					var record=panel.getSelectionModel().getSelected();
		 					if(record==null){
		 						alert("请您先选择要修改的设备信息");
		 						Ext.getBody().unmask();
		 					}else{
		 						showWindown("duty_update");
					 			dutyForm.getForm().setValues({
				        			"duty.dutyName" : record.get("name"),
				        			"duty.remarks": record.get("remarks") ,
				        			"duty.department.departmentID":thenode.id,
				        			"duty.dutyID": record.get("dutyID")
				        		});
		 					}
	 		    		}
	 					
			 			
	 				}
	 				}); 
	 		}
		},{
	    	text: '增加',disabled:true,id:'cToolImportDevice',
	    	icon:'../image/public/user_add.gif',
	   		 handler:function(){
	    		if(thenode==0){
	    			alert("请选择区域设备");
	    		}else{
	    			
 						Ext.getBody().mask();
 		    			 store2.load({
 				    			params:{
 				    				zoneID:0
 				    			}
 				    		});
 				   			showWindown();
	    		}
	   			
	   			
	   		}
	
	 }],
		bbar:new Ext.PagingToolbar({
			pageSize : 10, //每页显示几条
			store : store,
			beforePageText:"当前第",   
            afterPageText:"页，共{0}页",   
            lastText:"尾页",   
            nextText :"下一页",   
            prevText :"上一页",   
            firstText :"首页",                           
	        displayInfo:true, 
	        displayMsg:'显示第{0}条数据到{1}条数据,一共有{2}条', 
	        emptyMsg:'没有记录'
		})
	});
	store.load({
			params : {
				start : 0,
				limit : 10
			}		
	});//加载数据  注意，一旦使用了分页条， store.load();就必须在构造表格之后进行执行，否则将不起作用，并且将分页条和数据源关联，从而实现与表格共享数据模型
	store2=new Ext.data.JsonStore({
		url: 'zone_load',
	    fields: ["deviceName","place","department","useDepartment","deviceInfoID"]
	});//存储前两项的定义的东西，将其连接起来
	
	 panel2=new Ext.grid.GridPanel({
		cm:cm2,
		border:false,
		store:store2,
		height:170,
		x:200,
		y:100,
		sm:sm,
		width:150,
		enableColumnMove:false,//不可以使表格列移动
		enableColumnResize:false, //不可以改变列的宽度
		stripeRows:false, //True表示为显示行的分隔符
		loadMask:true,  //会有一个Ext.LoadMask的遮罩效果
		trackMouseOver : true,  //True表示为鼠标移动时高亮显示（默认为true）。
		enableDragDrop : true
	});
	 store3=new Ext.data.JsonStore({
		
		});
	panel3=new Ext.grid.GridPanel({
		cm:cm2,
		height:300,
		store:store3,
		width:170,
		enableColumnMove:false,//不可以使表格列移动
		enableColumnResize:false, //不可以改变列的宽度
		stripeRows:false, //True表示为显示行的分隔符
		loadMask:true,  //会有一个Ext.LoadMask的遮罩效果
		trackMouseOver : true,  //True表示为鼠标移动时高亮显示（默认为true）。
		enableDragDrop : true,
		buttons:[{
			text:'确定',
			cls : 'blue1',
			handler:function(node){
				alert(thenode);
				 json2=[];
				json2.push(str);
				Ext.Ajax.request({
					url:'zone_update',
					params:{
						ids:json2
					},
					success:function(){
						win.close();
						Ext.getBody().unmask();
					}
				});
				
			}
		},{
			text:'取消',
			cls : 'blue1',
			handler:function(){
				Ext.getBody().unmask();
				win.close();
			}
		}]
		
	});
	
	
	function showWindown(){
		
		zoneForm=new Ext.form.FormPanel({
			layout:'form',
			border:false,
			//renderTo:'zoneForm',
			height:360,
			width:460,
			x:200,
			y:300,
			
			buttonAlign:'right',
			region:"center", 
			bodyStyle:"body-align:right",
			//style:{
 				//marginRight: 'auto',
  				//marginLeft: 'auto'
			//},
			items:[{
				layout:'column',
				items:[panel2,
				    {layout:'form',
					items:[{
						width:90,
						height:300,
						border:false,
						buttons:[{
							text:'添加',
							cls:'btn_add',
							handler:function(node){
							 	oSelMode    = panel2.getSelectionModel();
								oRecords    = oSelMode.getSelections();
								
								//var sIds = "";
								 str = "[";
								for(var i=0;i<oRecords.length;i++){
								store3.add(oRecords[i]);
								ids=oRecords[i].get("deviceInfoID");
								 json2=[];
								 str += "{deviceInfoID:"+oRecords[i].get("deviceInfoID")+",zoneID:"+thenode+"},";
							//	json2.push({deviceInfoID:ids,zone:{zoneID:thenode}});
								//var Dids=[{'deviceID':ids[i]}];
								 if(i != oRecords.length-1) ids += ",";
							}
								str = str.substring(0, str.length-1);
								str += "]";
								alert("str="+str);
								alert(ids);
						}
					},{
						text:'移出',
						cls : 'btn_del',
						//style:'position:absolute;top:150px;left:300px;',
						handler:function(){
							oSelMode    = panel3.getSelectionModel();
							oRecords    = oSelMode.getSelections();
							for(var i=0;i<oRecords.length;i++){
								store2.remove(oRecords[i]);
								ids=oRecords.get("deviceInfoID");
							}
						}
					}]		
					}]
						
				},panel3]
			}]
		});
		win=new Ext.Window({
			//title:'区域信息',
			 width:476,
			 height:330,
			 draggable:false,//拖动
			 resizable:false,	//变大小	
			 items:[zoneForm],
			 xtype:'form',
			 listeners:{"beforedestroy":function(obj)
                 { 
				 Ext.getBody().unmask();  
                    // obj.show(); return false; 
                  }
			}  
		});
		win.show();
	}
	
	 new Ext.Viewport({  
		layout : 'border', // 使用border布局  
		border:false,
		items:[{
			region:'west',
			border:false,
			autoScroll : true,
			width:200,
			
			height:window.screen.height,
			items:[tree]
		},panel],
		listeners:{
			'beforerender' : function(cmp) {
				// set role
				var store=new Ext.data.JsonStore({
					url: '../system/role_loadFunc?funcCode=ControlZoneDevice',
					autoLoad : true,
					fields: ["functioncode"]
				});
				store.load({
				    callback: function(records, options, success){
				    	var i=0;
				    	for(; i<records.length; i++) {
				    		var id = records[i].get("functioncode");
				    		//alert('d'+Ext.getCmp('56').text);
				    		if(Ext.getCmp(id)!=null) {
				    			Ext.getCmp(id).setDisabled(false);
				    		}
				        }
				    },
				    scope: store
				});
			}
		}
	 }); 
	 
});
</script> 	
</head>
<body>
<div id="grid"></div>
<div id="tree"></div>
<fieldset>
<div id="zoneForm"></div>
</fieldset>
</body>
</html>




